//单据
<template>
    <div>
      <div >
        <el-page-header @back="back()" content="进货详情页面" style="margin-bottom: 10px;"/>
        <el-table
          border
          highlight-current-row
          max-height="55vh"
          height="55vh"
          :data="receiptList.slice((currentPage-1)*pagesize,currentPage*pagesize)">
          <el-table-column
            type="index"
            align="center"
            label="序号"
          ></el-table-column>
          <el-table-column
            prop="receipt_no"
            label="销售单号"
            align="center">
          </el-table-column>
          <el-table-column
            prop="totalcost"
            label="进货金额"
            align="center">
          </el-table-column>
          <el-table-column
            prop="date"
            label="进货日期"
            align="center">
          </el-table-column>
          <el-table-column
            align="center">
            <template slot-scope="scope">
              <router-link :to="{path:'/receipt/receiptDetail',query:{receipt_no:scope.row.receipt_no}}">
                <el-button >详细信息</el-button>
              </router-link>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[5, 10, 20, 40]"
          :page-size="pagesize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="receiptList.length">
        </el-pagination>
      </div>
    </div>
</template>

<script>
    export default {
        name: "Receipt",
      data(){
          return{
            receiptList:[],
            currentPage:1, //初始页
            pagesize:5,    //    每页的数据
          }
      },
      methods:{
          back(){
            this.$router.back()
          },
        // 初始页currentPage、初始每页数据数pagesize和数据data
        handleSizeChange: function (size) {
          this.pagesize = size;
        },
        handleCurrentChange: function(currentPage){
          this.currentPage = currentPage;
        },
          loadReceiptNo(){
            var _this=this;
            _this.$axios.get('/receipt/receiptList').then(resp=>{
              if(resp && resp.status==200){
                _this.receiptList=resp.data
                //console.log(JSON.stringify(_this.receiptList))
              }
            })
          },
      },
      mounted() {
          this.loadReceiptNo();
      }
    }
</script>

<style scoped>

</style>
